<template>
    <div>
        <AppHeader />
        <div class="page-content">
            <!-- 没有侧边栏 -->
            <template v-if="isNoSideBar">
                <!-- 不需要头部通栏 -->
                <div class="container w-10/12 m-auto" v-if="!isFullWidth">
                    <router-view />
                </div>
                <template v-else>
                    <router-view />
                </template>
            </template>
            <div class="container w-10/12 m-auto" v-else>
                <div class="flex">
                    <div class="w-1/5 mr-2">
                        <AppSideBar />
                    </div>
                    <div class="w-4/5 ml-2">
                        <router-view />
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup>

// 1. 课程详情页 + 试卷详情 需要隐藏左侧边栏并有头部通栏的效果
// 2. 课程详情页              需要隐藏左侧边栏并没头部通栏的效果
// 3. 班级课程详情页          需要隐藏左侧边栏并没头部通栏的效果 class-course-detail?id=1
const isNoSideBar = computed(() => {
    const route = useRoute()
    return route.path.includes('-detail')
})

const isFullWidth = computed(() => {
    const route = useRoute()
    const p = route.path
    return p.includes('/course-detail') || p.includes('/lesson-detail') || p.includes('/paper-detail')
})


import useUserInfo from '@/store/user';

const userInfo = useUserInfo()

</script>